<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>云实验室</title>
    <link href="/static/css/bootstrap.min.css" rel="stylesheet">
    <script src="/static/js/jquery.min.js"></script>
    <script src="/static/js/bootstrap.min.js"></script>
    <script src="/static/js/app.js"></script>
<style>
.col-center-block {
    float: none;
    display: block;
    margin-left: auto;
    margin-right: auto;
    margin-top: 100px;
    width: 424px;
}
</style>
</head>

<div class="panel panel-default col-center-block">
  <div class="panel-heading"><span>云实验室</span></div>
  <div class="panel-body">
    <form class="form-horizontal" role="form" action='/account/login' method="post">
        {% csrf_token %}
        <div class="container">
          <div class="row myCenter">
            <div class="col-xs-6 col-md-4">
              <form class="form-signin">
                <h2 class="form-signin-heading">登录</h2>
                </br>
                <p>用户名</p>
                <input type="text" name="username" class="form-control" placeholder="" required autofocus>
                </br>
                <p>密码</p>
                <input type="password" name="password" class="form-control" placeholder="" required>
                </br>
                <div class="checkbox">
                  <label><input type="checkbox" value="remember-me">记住我</label>
                </div>
                </br>
                <button class="btn btn-lg btn-primary btn-block" type="submit">登录</button>
                </br>
                {% if message %}
                    <div class="alert alert-warning">{{ message }}</div>
                {% endif %}
              </form>
            </div>
          </div>
        </div>
        </form>
  </div>
</div>

</html>